{{template "shared/bootstraptablejs.html"}}

<script>
    var $dataGrid = $('#dataGrid');
    // var $searchForm = $("#searchForm");

    //高亮显示id
    var highlightPk = null;

    //初始化加载
    $(function () {
        pageInit();
    });

    //初始化页面
    function pageInit() {
        //初始化查询条件
        queryParamsInit();

        //初始化表格
        dataGridInit();

        //搜索
        $("#btnSearch").on("click", function (e) {
            refreshToFirstPage();
        });

        //清除搜索
        $("#btnClearSearch").on("click", function (e) {
            $('.searchForm input[name="CustomerNO"]').val('');
            $('.searchForm input[name="CustomerName"]').val('');

            refreshToFirstPage();
        });

        //绑定加载成功的事件，成功后高亮显示当前项
        $dataGrid.on('load-success.bs.table', function () {
            if (highlightPk !== null && typeof highlightPk !== 'undefined') {
                sdtheme.highlight($dataGrid.find('tbody tr[data-pk="' + highlightPk + '"]'));
            }
            //高亮显示一次后失效
            highlightPk = null;
        });

        //保持搜索条件面板状态
        sdtheme.searchPanelStatusInit('searchpanelbtn');
    }

    //查询条件初始化
    function queryParamsInit() {
        //从cookie加载查询条件，传入参数为form id
        sdtheme.loadSearchText('searchForm');

        layui.use('laydate', function () {
            var laydate = layui.laydate;

            //当前范围 减 6
            var tmp_cur = new Date();
            var predate = new Date(tmp_cur.setDate(tmp_cur.getDate() - 1));
            //yyyy-MM-dd - yyyy-MM-dd
            var cur_date = predate.format('yyyy-MM-dd') + ' - ' + predate.format('yyyy-MM-dd');

            laydate.render({
                elem: '#CollectDate',
                range: true,
                value: cur_date,
                max: 0
            });
        });
    }

    //刷新当前页
    function refresh(pk) {
        $dataGrid.bootstrapTable('refresh');
        highlightPk = pk;
    }

    //刷新并跳转至第一页
    function refreshToFirstPage() {
        //表格刷新时，保存查询条件到cookie
        sdtheme.saveSearchText('searchForm');

        //刷新并跳转至第1页
        $dataGrid.bootstrapTable('refresh', {pageNumber: 1});

        //同时要更新cookie里保存当前页码
        $.cookie('dataGrid.bs.table.pageNumber', 1, {expires: 1});
    }

    //bootstrap table data init
    function dataGridInit() {
        $dataGrid.bootstrapTable({
            method: 'post',
            url: '{{ urlfor "TotalCollectRateController.DataGrid"}}',
            sidePagination: 'server',  //服务器端用 server
            idField: 'CollectDate',    //标识哪个字段为id主键
            queryParamsType: 'limit',   //参数格式,发送标准的RESTFul类型的参数请求
            queryParams: function (params) {
                params.CollectDate  = $('.searchForm input[name="CollectDate"]').val();
                params.CustomerNO   = $('.searchForm input[name="CustomerNO"]').val();
                params.CustomerName = $('.searchForm input[name="CustomerName"]').val();
                return params;
            },
            striped: true,         //使表格带有条纹
            pagination: true,      //在表格底部显示分页工具栏
            showRefresh: true,     //显示刷新按钮
            showColumns: true,     //显示隐藏列
            toolbar: '#toolbar',    //设置工具栏的Id或者class
            pageSize: 10,
            pageList: [5, 10, 20, 100, 200],
            paginationShowPageGo: true,    //20170812 lht 扩展select跳转
            paginationUseBSSelect: true,   //20170812 lht 扩展select跳转 启用BoostrapSelect(页面须引用botstrap-select.min.js)
            cookie: true,
            classes: 'table table-bordered table-hover',
            undefinedText: '',
            sortName: 'CollectDate',
            sortOrder: 'asc',
            stickyHeader: true,
            resizable: true,

            columns: [
                {
                    field: 'CollectDate',
                    title: '采集时间',
                    width: '120px',
                    align: 'center',
                    sortable: true,
                    formatter: sdtheme.formatterDateBySpan
                }, {
                    field: 'CustomerNO',
                    title: '客户编号',
                    align: 'center',
                    width: '120px',
                    sortable: true
                }, {
                    field: 'CustomerName',
                    title: '客户名称',
                    width: '110px',
                    align: 'center',
                    sortable: true
                }, {
                    field: 'Num',
                    title: '电表数量',
                    width: '110px',
                    align: 'center',
                    sortable: true
                }, {
                    field: 'NeedRows',
                    title: '应采集数量',
                    width: '110px',
                    align: 'center',
                    sortable: true
                }, {
                    field: 'Rows',
                    title: '实采集数量',
                    width: '110px',
                    align: 'center',
                    sortable: true
                }, {
                    field: 'Rate',
                    title: '采集完成率',
                    width: '110px',
                    align: 'center',
                    sortable: true,
                    formatter: sdtheme.showTableRate
                }
                ],
            onLoadSuccess: function (data) {
                layer.closeAll('loading');
            },
            onSort: function (name, order) {

            },
            onPageChange: function () {

            },
            onCheckAll: function (rows) {

            },
            onCheck: function (rows) {

            },
            onUncheck: function (rows) {

            },
            onUncheckAll: function () {

            },
            onLoadError: function (status) {
                layer.alert('获取数据失败,错误代码：' + status);
            }
        });
    }
</script>